<template>
  <div class="login-content">
    <wx-input @getValues="getValuesTel" :datas="telephone"></wx-input>
    <wx-input @getValues="getValuesPwd" :datas="pwd"></wx-input>
    <wx-input @getValues="getValuesrPwd" :datas="rpwd"></wx-input>
    <div style="margin-top: 20px">
      <span @click="registerNow">
        <wx-button :datas="loginBtn"></wx-button>
      </span>
    </div>
    <span style="margin-top: 15px;letter-spacing: 2px;" @click="goLogin">返回登陆</span>
  </div>
</template>

<script>
import wxInput from '@/components/wxInput'
import wxButton from '@/components/wxButton'
import { mapActions } from 'vuex'
export default {
  name: 'login',
  components: {
    wxInput, wxButton
  },
  data () {
    return {
      login_bg: require('../../../static/bg-img/b9.jpg'),
      registerData: {
        telephone: -1,
        password: -1
      },
      telephone: {
        label: 'telephone',
        type: 'text',
        id: 'telephone'
      },
      pwd: {
        label: 'password',
        type: 'password',
        id: 'user2'
      },
      rpwd: {
        label: 'repassword',
        type: 'password',
        id: 'user3'
      },
      loginBtn: {
        text: 'REGISTER'
      }
    }
  },
  methods: {
    getValuesTel (val) {
      if (!val) return false
      this.registerData.telephone = val
    },
    getValuesPwd (val) {
      if (!val) return false
      this.registerData.password = val
    },
    getValuesrPwd (val) {
      if (!val) return false
    },
    goLogin () {
      this.$router.push({name: 'login'})
    },
    registerNow () {
      let params = {
        telephone: this.registerData.telephone,
        password: this.registerData.password
      }
      this._register(params)
        .then((res) => {
          this.$notify({
            title: '成功',
            message: res.data.result.msg,
            type: 'success'
          })
          this.$router.push({name: 'login'})
        })
        .catch((err) => {
          return Promise.reject(err)
        })
    },
    ...mapActions(['_register'])
  }
}
</script>

<style scoped lang="less">

  .login-content{
    text-align: center;
  }
</style>
